<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<%@ page import="com.google.appengine.api.users.User" %>
<%@ page import="com.google.appengine.api.users.UserService" %>
<%@ page import="com.google.appengine.api.users.UserServiceFactory" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en-US" lang="en-US">
	<head>
		<title>Chat Room</title>
		<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
		<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js"></script>
		<script src="/js/chat.js"></script>
	</head>	
	<body>
<%
    UserService userService = UserServiceFactory.getUserService();
    User user = userService.getCurrentUser();
    if (user != null) {
%>
	<p>Hello, <%= user.getNickname() %>! (You can
	<a href="<%= userService.createLogoutURL(request.getRequestURI()) %>">sign out</a>.)</p>
	<div>
		<div id="chat_story" style="width: 800px; height: 300px; border: solid 1px; overflow: scroll; padding-left:10px;"></div>
	</div>  
	<div style="margin-top:10px;">
	    <div style="float: left;"><textarea id="msg_box" name="content" style="width:708px; height:66px;"></textarea></div>
	    <div style="margin-left: 10px; float: left;"><input type="button" value="Send" onclick="sendMessageChat()" style="width: 80px; height: 73px;" /></div>
	 </div>
	 <div style="margin-left: 10px; float: left;"><input type="button" value="Clear All" onclick="deleteMessageChat()" style="width: 80px; height: 73px;" /></div>
<%
    } else {
%>
<p>Hello! Please 
<a href="<%= userService.createLoginURL(request.getRequestURI()) %>">sign in</a>
to chat with us.</p>
<%
    }
%>
	 </body>
</html>